<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-3.4.1.js"></script>
</head>
<body>
	
		用户名:<input type="text" name="username" id="username"/><br>
		密码：<input type="text" name="password" id="password"/><br>
		<input type="button" id="btn" name="btn"value="submit"/>
	
	<script>
	$(function(){
		$("#btn").click(function(){
			console.log(JSON.stringify({"username":$("#username").val(),"password":$("#password").val()}))
			$.ajax({
				url:"${pageContext.request.contextPath }/testJson",
				type:"post",
				data:JSON.stringify({"username":$("#username").val(),"password":$("#password").val()}),
				contentType:"application/json;charset=UTF-8",
				dataType:"json",
				success:function(data){				
					if(data!=null){
						alert("您输入的用户名为："+data.username+"密码为："+data.password)
					}
				}
			})
		})
	})
		
	</script>
</body>
</html>